<template>
  <view class="list-container">
    <view class="">
      <navigator :url="url">
        <view class="line-first">
          <view class="title">
            仓库运货管理员
          </view>
          <view class="price">
            4000 元/月
          </view>
        </view>
        <view class="line-second">
          <view class="addr">
            <text class="cuIcon-location space-r-10"></text>
            上海市松江区松东路326号
          </view>
          <view class="distance">
            10.34km
          </view>
        </view>
        <view class="line-third">
          <view class="time">
            <text class="mark">月结</text>
            <text class="cuIcon-time space-r-10"></text>
            11-20
          </view>
        </view>
      </navigator>
    </view>
  </view>
</template>

<script>
  export default {
    data(){
      return {
        
      }
    },
    onLoad() {
    },
    props:{
      url: {
        type: String,
        default: '/pages/detail/detail'
      },
    },
  }
</script>

<style>
  .list-container {
    padding: 40upx;
    border-bottom: 1px solid #ddd;
    font-size: 30upx;
  }
  .line-first, .line-second, .line-third {
    display: flex;
  }
  .line-first {
    font-size: 40upx;
    margin-bottom: 30upx;
  }
  .line-first .price {
    color: #F37B1D;
  }
  .line-second {
    margin-bottom: 15upx;
  }
  .line-third .mark {
    border: 1px solid #ddd;
    border-radius: 2px;
    padding: 2px 40upx;
    margin-right: 30upx;
  }
  .space-r-10 {
    margin-right: 10upx;
  }
  
  .line-first,
  .line-second, 
  .line-third {
    dispaly: flex;
    justify-content: space-between;
  }
</style>
